﻿<!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Amaze UI Admin index Examples</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="icon" type="image/png" href="assets/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="assets/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
    <link rel="stylesheet" href="assets/css/amazeui.min.css"/>
    <link rel="stylesheet" href="assets/css/amazeui.datatables.min.css"/>
    <link rel="stylesheet" href="assets/css/app.css">
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/jquery.cookie.js"></script>
</head>
<body data-type="login">
<script src="assets/js/theme.js"></script>
<div class="am-g tpl-g">
    <!-- 风格切换 -->
    <div class="tpl-skiner">
        <div class="tpl-skiner-toggle am-icon-cog">
        </div>
        <div class="tpl-skiner-content">
            <div class="tpl-skiner-content-title">
                选择主题
            </div>
            <div class="tpl-skiner-content-bar">
                <span class="skiner-color skiner-white" data-color="theme-white"></span>
                <span class="skiner-color skiner-black" data-color="theme-black"></span>
            </div>
        </div>
    </div>
    <div class="tpl-login">
        <div class="tpl-login-content">
            <div class="tpl-login-logo">

            </div>


            <form class="am-form tpl-form-line-form" id="myform" action="/login" method="post">
                <div class="am-form-group">
                    <input type="text" name="userName" class="tpl-form-input" id="user-name" placeholder="请输入账号">

                </div>

                <div class="am-form-group">
                    <input type="password" name="password" class="tpl-form-input" id="user-password"
                           placeholder="请输入密码">

                </div>
                <div class="am-form-group tpl-login-remember-me">
                    <input id="remember-me" name="rememberUser" type="checkbox">
                    <label for="remember-me">
                        记住密码
                    </label>

                </div>
                <div class="am-form-group">

                    <button type="button"
                            class="am-btn am-btn-primary  am-btn-block tpl-btn-bg-color-success  tpl-login-btn"
                            id="submit-button">提交
                    </button>

                </div>
            </form>
        </div>
    </div>
</div>

<div class="am-modal am-modal-alert" tabindex="-1" id="your-modal">
    <div class="am-modal-dialog">

        <div class="am-modal-bd">
            用户名或密码不正确！
        </div>
        <div class="am-modal-footer">
            <span class="am-modal-btn">确定</span>
        </div>
    </div>
</div>
<script src="assets/js/amazeui.min.js"></script>
<script src="assets/js/app.js"></script>
<script src="assets/js/md5.js"></script>
<script>
    var isCookie = true;
    jQuery(function () {
        //获取cookie的值
        var username = $.cookie('username');
        var password = $.cookie('password');
        //将获取的值填充入输入框中
        $('#user-name').val(username);
        $('#user-password').val(password);
        if (username != null && username != '' && password != null && password != '') {//选中保存秘密的复选框
            $("#remember-me").attr('checked', true);
        }
        $("#user-password").click(function () {
            $('#user-password').val("");
            isCookie = false;
        });
        $("#user-password").focus(function () {
            $('#user-password').val("");
            isCookie = false;
        });
        $("#submit-button").click(function () {
            login();
        });

        $(document).keyup(function(event){
            if(event.keyCode ==13){
                $("#submit-button").trigger("click");
            }
        });

    });
    function login() {
        var uName = $('#user-name').val();
        var psw = $('#user-password').val();
        $.ajax({
            //提交数据的类型 POST GET
            type: "POST",
            //提交的网址
            url: "/login",
            //提交的数据
            data: {userName: uName, password: psw, cookie: isCookie},
            //返回数据的格式
            datatype: "text",//"xml", "html", "script", "json", "jsonp", "text".
            //在请求之前调用的函数
            //beforeSend:function(){$("#msg").html("logining");},
            //成功返回之后调用的函数
            success: function (data) {
                if (data == "success") {
                    loginSuccess();
                } else {
                    var $modal = $('#your-modal');
                    $modal.modal();
                }
            },
            //调用出错执行的函数
            error: function () {
                $('#myAlert').alert();
            }
        });

    }

    function loginSuccess() {
        if (($("#remember-me").is(":checked"))) {//保存密码
            if (isCookie) {
                $(window).attr('location', '/index.jsp');
            }
            else {
                var uName = $('#user-name').val();
                var psw = $('#user-password').val();
                $.ajax({
                    //提交数据的类型 POST GET
                    type: "POST",
                    //提交的网址
                    url: "/login/encrypt",
                    //提交的数据
                    data: {password: psw},
                    //返回数据的格式
                    datatype: "text",//"xml", "html", "script", "json", "jsonp", "text".
                    //在请求之前调用的函数
                    //beforeSend:function(){$("#msg").html("logining");},
                    //成功返回之后调用的函数
                    success: function (data) {
                        $.cookie('username', uName, {expires: 7, path: '/'});
                        $.cookie('password', data, {expires: 7, path: '/'});
                        $(window).attr('location', '/index.jsp');
                    },
                    //调用出错执行的函数
                    error: function () {
                        $('#myAlert').alert();
                    }
                });
            }
        } else {//删除cookie
            $.cookie('username', '', {expires: -1, path: '/'});
            $.cookie('password', '', {expires: -1, path: '/'});
            $(window).attr('location', '/index.jsp');
        }
    }
</script>
</body>

</html>